<!DOCTYPE html>
<head>
  <style>
    iframe {
      width: 400px;
      height: 300px;
    }
  </style>
  <script>
    addEventListener('load', function() {
      // Since the picture <source> in the iframe is set to 50vw, resizing the
      // iframe should cause the image to resize with it.
      var iframe = document.getElementById('iframe');
      iframe.style.width = "200px";
    });
  </script>
</head>
<body>
  <iframe id="iframe" src="resources/viewport-resize-after-load-iframe.html">
</body>

